# Component: Page Not Found

Standardized 404 error messaging container

Static Block

### BEM Anatomy

| Type      | Class Name           | Description                                                                             |
| --------- | -------------------- | --------------------------------------------------------------------------------------- |
| ==Block== | `.as-page-not-found` | The main error wrapper. Integrated with the `.container` class for site-wide alignment. |
| Element   | `__content`          | Inner wrapper for the text elements. Manages bottom spacing for the error section.      |
| Element   | `__title`            | Primary error heading (e.g., "Page not found").                                         |
| Element   | `__label`            | Subtext providing additional context to the user.                                       |

### Layout & Spacing

The component relies on simple vertical rhythm, adding a margin below the content area to ensure that error pages don't feel "cramped" if footer elements are present.

##### Generated HTML

```html
<div class="as-page-not-found as-page__content container">
    <div class="as-page-not-found__content">
        <h2 class="as-page-not-found__title">
            Page not found
        </h2>
        <p class="as-page-not-found__label">
            The page could not be found
        </p>
    </div>
</div>
```

##### SCSS

```scss
.as-page-not-found {
  &__content {
    // Standardized spacing for error 
    // message clearance
    margin-bottom: 1.5rem;
  }
}
```
